<template>
  <view>
    <custom-navbar title="简历管理" :autoBack="true" leftIconColor="#303133" />
    <view class="drop-down h-88rpx flex items-center justify-between bg-#fff px-74rpx text-28rpx">
      <view v-for="item in menu" :key="item.type" class="flex items-center" @tap="showPopup(item)">
        <text class="mr-8rpx pb-8rpx">
          {{ item.name }}
        </text>
        <up-icon color="#4e5969" size="16rpx" name="arrow-down-fill" />
      </view>
    </view>
    <view class="px-24rpx bg-#fff">
      <up-search :showAction="true" actionText="搜索" placeholder="输入姓名查找简历" v-model="keyword_name" @search="searchFn"
        @custom="searchFn"></up-search>
    </view>
    <view>
      <view v-for="item, key in res" :key="key" class="mb-32rpx bg-#fff px-54rpx">
        <view class="flex items-center justify-between px-0rpx py-24rpx bg-#f7f9ff text-[#1d2129] text-[26rpx]"
          v-if="item.have_teacher == 1">
          <text>{{item.teacher_school_name}}·{{item.teacher_college_name}}·{{item.teacher_name}}老师推荐 </text>
          <text>{{item.status_name}}</text>
        </view>
        <view class="pb-36rpx pt-18rpx">
          <view @click="routerToResumeDetail(item.resume_id)">
            <up-gap height="20rpx" />
            <view class="flex">
              <view class="mr-16rpx h-100rpx w-100rpx shrink-0">
                <up-image width="100rpx" height="100rpx" shape="circle" :src="item.avatar" />
              </view>
              <view class="flex-auto">
                <view class="mb-16rpx flex items-center justify-between">
                  <view class="text-32rpx color-#1d2129">
                    {{item.name}}
                  </view>

                </view>
                <view class="flex text-26rpx color-#6e6d72 leading-100%">
                  <text>{{item.province}}·{{item.city}}</text>
                  <up-line length="30rpx" color="#6e6d72" direction="col" margin="0 12rpx" />
                  <text>{{item.gender}}</text>
                  <up-line length="30rpx" color="#6e6d72" direction="col" margin="0 12rpx" />
                  <text>{{item.qualification}}</text>
                  <up-line length="30rpx" color="#6e6d72" direction="col" margin="0 12rpx" />
                  <text>{{item.nature}}</text>
                </view>
              </view>
            </view>
            <up-gap height="20rpx" />
            <view class="flex flex-wrap gap-10rpx justify-between">
              <view class="flex items-center">
                <view class="mr-10rpx bg-#fcf8e9 px-8rpx color-#f57100 leading-42rpx"
                  v-for="highlight in item.highlights">
                  {{highlight}}
                </view>
              </view>
            </view>
            <view style="border-bottom: 1px solid #ededed;" class="mt-22rpx mb-30rpx"></view>
            <view class="flex flex-wrap items-center text-26rpx color-#6e6d72 leading-36rpx">
              <text>{{item.school_name}}</text>
              <up-line length="30rpx" color="#6e6d72" direction="col" margin="0 12rpx" />
              <text>{{item.college_name}}</text>
              <up-line length="30rpx" color="#6e6d72" direction="col" margin="0 12rpx" />
              <text>{{item.status_overseas_study}}</text>
            </view>
            <up-gap height="20rpx" />
            <view class="flex items-center justify-between">
              <view class="flex flex-wrap items-center text-26rpx color-#4e5968 leading-36rpx">
                <text>{{item.heart_content}}</text>
              </view>
            </view>
          </view>
          <view style="border-bottom: 1px solid #ededed;" class="mt-22rpx mb-30rpx"></view>
          <view class="flex items-center justify-between">
            <view class="bg-#f3f4f8 rounded-[30rpx] py-12rpx px-24rpx text-[#7b7b7b] text-[24rpx]" v-if="item.status==1"
              @click="onClickNoAgree(item.resume_id, key)">不合适</view>
            <view class="py-12rpx px-24rpx" v-if="item.status!=1"></view>
            <view class="flex items-center">
              <view
                class="bg-#f3f4f8 rounded-[30rpx] py-12rpx px-24rpx text-[#7b7b7b] text-[24rpx] flex items-center mr-20rpx">
                <view class="mr-20rpx">{{statusList[item.status]}}</view>
                <view class="iconfont icon-xiajiantou"></view>
              </view>
              <up-button :custom-style="{
              width: '144rpx',
              height: '58rpx',
              background: '#1f50f2',
              'border-radius': '60rpx',
              'font-size': '24rpx',
              color: '#ffffff',
              margin: '0',
            }">
                立即沟通
              </up-button>
            </view>

          </view>
        </view>
      </view>

    </view>
    <up-popup :show="popupData.show" mode="center" :safe-area-inset-bottom="false" bg-color="transparent" @close="close"
      @open="open">
      <view class="w-662rpx overflow-hidden rounded-24rpx bg-#fff">
        <view class="relative h-106rpx flex items-center justify-end px-24rpx">
          <text class="absolute left-50% top-50% translate-[-50%] text-center text-[28rpx] text-[#1d2129] font-medium">
            {{ popupData.title }}
          </text>
          <up-icon :name="PopupClose" color="#f2f2f2" size="44rpx" @tap="popupData.show = false" />
        </view>
        <view>
          <!-- 城市/职位分类 -->
          <SecondaryCategory v-if="popupData.menuType === '1'" :list="secondaryCategoryList" :type="popupData.menuType"
            @getSearchList="getSearchList" />
          <view class="text-center" v-if="popupData.menuType === '2'">
            <view class="py-24rpx" :class="{ 'color-#1F50F2': sex == '' }"
              @click="sex='';popupData.show = false;getJobResumeList()">全部
            </view>
            <view class="py-24rpx" :class="{ 'color-#1F50F2': sex == '男' }"
              @click="sex='男';popupData.show = false;getJobResumeList()">男</view>
            <view class="py-24rpx" :class="{ 'color-#1F50F2': sex == '女' }"
              @click="sex='女';popupData.show = false;getJobResumeList()">女</view>
          </view>
          <view class="text-center" v-if="popupData.menuType === '3'">
            <view v-for="(item,index) in xueliList" :key="index" class="py-24rpx"
              :class="{ 'color-#1F50F2': xueli == item.value }"
              @click="xueli = item.value;popupData.show = false;getJobResumeList()">
              {{item.value}}
            </view>
          </view>
        </view>
      </view>
    </up-popup>
  </view>
</template>

<script setup lang="ts">
  // import PopupClose from "@/static/images/common/popup-close.png";
  import { hrRectiveResumeList, hrResumeStatusUpdate } from "@/api/user";
  // import SecondaryCategory from '@/pages/common/search/components/secondary-category.vue';
  import SecondaryCategory from '../components/secondary-category.vue';
  import { userJobType } from "@/api/user";
  const PopupClose = 'https://yiliao.test03.qcw800.com/static/images/common/popup-close.png'
  const options = ref<Record<string, string>>({});

  interface MenuItem {
    type : string;
    name : string;
    showPopup : boolean;
  }

  const menu = ref<Array<MenuItem>>([
    {
      name: "全部职位",
      type: "1",
      showPopup: true,
    },
    {
      name: "性别",
      type: "2",
      showPopup: true,
    },
    {
      name: "学历",
      type: "3",
      showPopup: true,
    },
    // {
    //   name: "学校类别",
    //   type: "4",
    //   showPopup: true,
    // },
    // {
    //   name: "时间段",
    //   type: "5",
    //   showPopup: true,
    // },
  ]);
  // 职位分类列表
  const classificationList = [
    {
      name: '全部',
      code: ''
    }
  ];
  const sex = ref('');
  type List = { name : string; children : { name : string }[] }[];
  // 城市列表
  const cityList = [
    {
      name: "热门城市",
      children: [
        {
          name: "全国",
        },
        {
          name: "上海",
        },
        {
          name: "重庆",
        },
      ],
    },
    {
      name: "北京",
      children: [
        {
          name: "北京一区",
        },
        {
          name: "北京二区",
        },
        {
          name: "北京三区",
        },
        {
          name: "北京三区",
        },
        {
          name: "北京三区",
        },
        {
          name: "北京三区",
        },
        {
          name: "北京三区",
        },
        {
          name: "北京三区",
        },
        {
          name: "北京三区",
        },
      ],
    },
    {
      name: "天津",
      children: [
        {
          name: "天津一区",
        },
        {
          name: "天津二区",
        },
        {
          name: "天津三区",
        },
      ],
    },
    {
      name: "河北",
      children: [
        {
          name: "河北一区",
        },
        {
          name: "河北二区",
        },
        {
          name: "河北三区",
        },
      ],
    },
  ];
  // // 职位分类列表
  // const classificationList = [
  //   {
  //     name: "不限",
  //     children: [
  //       {
  //         name: "全部",
  //       },
  //       {
  //         name: "临床试验",
  //       },
  //       {
  //         name: "临床研究",
  //       },
  //     ],
  //   },
  //   {
  //     name: "临床试验",
  //     children: [
  //       {
  //         name: "临床试验一区",
  //       },
  //       {
  //         name: "临床试验二区",
  //       },
  //       {
  //         name: "临床试验三区",
  //       },
  //       {
  //         name: "临床试验三区",
  //       },
  //       {
  //         name: "临床试验三区",
  //       },
  //       {
  //         name: "临床试验三区",
  //       },
  //       {
  //         name: "临床试验三区",
  //       },
  //       {
  //         name: "临床试验三区",
  //       },
  //       {
  //         name: "临床试验三区",
  //       },
  //     ],
  //   },
  //   {
  //     name: "医学产品研发",
  //     children: [
  //       {
  //         name: "医学产品研发一区",
  //       },
  //       {
  //         name: "医学产品研发二区",
  //       },
  //       {
  //         name: "医学产品研发三区",
  //       },
  //     ],
  //   },
  //   {
  //     name: "医学总查",
  //     children: [
  //       {
  //         name: "医学总查一区",
  //       },
  //       {
  //         name: "医学总查二区",
  //       },
  //       {
  //         name: "医学总查三区",
  //       },
  //     ],
  //   },
  // ];

  let statusList = {
    1: '待处理',
    2: '已联系',
    3: '不合适',
    4: '通过初筛',
    5: '通过初试',
    6: '通过复试',
    7: '通过终试',
    8: '已签约'
  }

  const routerToResumeDetail = (resume_id : number) => {
    uni.navigateTo({
      url: '/pages/userinfo/resume-HRPerspective?resume_id=' + resume_id,
    });
  };

  const open = () => { };
  const close = () => { };
  const secondaryCategoryList = ref<List>([]);
  const popupData = reactive({
    show: false,
    title: "",
    menuType: "",
  });
  const getUserJobType = async () => {
    let res = await userJobType();
    if (res) {
      res.map(v => {
        if (v.pid === 0) {
          classificationList.push({
            name: v.content,
            code: v.id,
            children: []
          })
        }
      })
      res.map(v => {
        classificationList.map(item => {
          if (classificationList.filter(vx => vx.code === v.id)) {
            if (item.code === v.pid) {
              item.children.push({
                name: v.content,
                code: v.id
              })
            }
          }
        })
      })
    }
  }
  const showPopup = (item : MenuItem) => {
    if (item.showPopup) {
      popupData.title = item.name;
      popupData.menuType = item.type;
      popupData.show = true;
      if (item.type === "1") {
        secondaryCategoryList.value = classificationList;
        // secondaryCategoryList.value = cityList;
      }
      // if (item.type === "2") {
      //   secondaryCategoryList.value = classificationList;
      // }
    }
  };
  const params = reactive({})
  const position_id = ref('')
  const getSearchList = (value) => {
    // console.log('getSearchList--value', value, JSON.stringify(value));
    let obj = value
    position_id.value = obj.value[obj.value.length - 1].code;
    getJobResumeList()
    // console.log('position_id.value', position_id.value);
  };

  async function onClickNoAgree(resume_id : number, index : number) {
    let r = await updateJobResume(resume_id, 3)
    if (!!r) {
      console.log('不合适参数 id:::', resume_id, ' index::', index, ' res:::', res)
      res[index].status = 3
      res[index].status_name = '不合适'
      //重载页面
    }
  }


  async function updateJobResume(resume_id : number, status : number) {
    let result = await hrResumeStatusUpdate({
      job_resume_id: resume_id,
      status: status,
    })
    console.log('更新简历状态 res:::', result);
    if (!!result && !!result.id) {
      return true
    } else {
      return false
    }
  }
  const res : any = reactive([]);
  async function getJobResumeList() {
    let result = await hrRectiveResumeList({
      position_id: position_id.value,
      gender: sex.value,
      qualification: xueli.value,
      name: keyword_name.value
    });
    console.log('简历管理 res list:::', result);
    //vue3传递result的值到子组件JobList中的属性jobList中
    for (let i = 0; i < result.list.length; i++) {
      const r = result.list[i]
      let rr = {
        resume_id: r.resume.id,
        avatar: r.user.avatar,
        name: r.user.name,
        gender: r.user.gender,
        status_name: '',
        status: r.status,
        province: r.user.province.name,
        city: r.user.city.name,
        qualification: r.user.education_last.qualification,
        nature: r.resume.intention.nature,
        highlights: r.resume.highlights,
        school_name: r.user.education_last.school_name,
        college_name: r.user.education_last.college_name,
        majors_name: r.user.education_last.majors_name,
        status_overseas_study: '',
        heart_content: r.resume.heart_content,
        have_teacher: !!r.teacher_user ? 1 : 0,
        teacher_name: '',
        teacher_school_name: '',
        teacher_college_name: '',
      }
      //1待处理 2已联系 3不合适 4通过初筛 5通过初试 6通过复试 7通过终试 8已签约
      switch (r.status) {
        case 1:
          rr.status_name = '待处理'
          break;
        case 2:
          rr.status_name = '已联系'
          break;
        case 3:
          rr.status_name = '不合适'
          break;
        case 4:
          rr.status_name = '通过初筛'
          break;
        case 5:
          rr.status_name = '通过初试'
          break;
        case 6:
          rr.status_name = '通过复试'
          break;
        case 7:
          rr.status_name = '通过终试'
          break;
        case 8:
          rr.status_name = '已签约'
          break;
        default:
          break;
      }
      if (r.user.education_last.status_overseas_study == 1) {
        rr.status_overseas_study = '留学'
      } else {
        rr.status_overseas_study = '未留学'
      }
      if (rr.have_teacher == 1) {
        rr.teacher_name = r.teacher_user.name
        rr.teacher_school_name = r.teacher_user.teacher.school.name
        rr.teacher_college_name = r.teacher_user.teacher.college.name
      }
      res.push(rr)
    }
  }
  const keyword_name = ref('')
  const searchFn = () => {
    getJobResumeList()
  };
  const xueliList = ref([])
  const xueli = ref('')
  onLoad((params : any) => {
    options.value = params;
    getJobResumeList()
    getUserJobType()
    let config = JSON.parse(uni.getStorageSync("config"))
    xueliList.value = config.configCli.config_qualification$$学历配置
    xueli.value = config.configCli.config_qualification$$学历配置[0].value
    console.log('xueli.value', xueli.value);
  });
</script>

<style scoped lang="scss"></style>
